import router, { constantRoutes } from '@/routers'
import asyncRoutes from '@/routers/router.config'
import { _getRouterList } from "@/service/api/user";
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import * as type from "../types";
// import { delete } from 'vue/types/umd';

/**
 * 通过 path 懒加载组件
 * @param {String} path
 */
const lazyLoad = path => {
  return (resolve) => {
    import(`@/views/${path}`).then(mod => {
      resolve(mod)
    }).finally(() => {
    })
  }
}
const lazyLoadLayout = path => {
  return (resolve) => {
    import(`@/layout`).then(mod => {
      resolve(mod)
    }).finally(() => {
    })
  }
}

/**
 * 通过meta.role判断是否与当前用户权限匹配
 * @param roles
 * @param route
 */
function hasPermission(roles, route) {
  // return true
  // if (route.meta && route.meta.roles) {
  //   return roles.some(role => route.meta.roles.includes(role))
  // } else {
  //   return true
  // }
  if(route.name === 'Layout' || route.name === '404')return true
  if(!roles.length){
    return false
  }
  return roles.some(role => {
    if(route.name===role.name){
      // route.path = role.path
      // route.meta.icon = role.icon
      route.id = role.id
      // route.meta.title = role.title
      return true
    }
  })
}

/**
 * 递归过滤异步路由表，返回符合用户角色权限的路由表
 * @param routes asyncRoutes
 * @param roles
 */
export function filterAsyncRoutes(routes) {
  const res = []

  routes.forEach(route => {
    const tmp = {...route}
    if(tmp.component && typeof tmp.component === "string") {
      if(tmp.component === "Layout") {
        tmp.component = lazyLoadLayout()
      }else if(tmp.component === "Blank") {
        tmp.component = {render:h => h('router-view')}
      }else {
        tmp.component = lazyLoad(tmp.component)
      }
    } else {
      delete tmp.component
    }

    if(tmp.children && tmp.children.length) {
      tmp.children = filterAsyncRoutes(tmp.children)
    }else {
      delete tmp.children
    }
    res.push(tmp)
  })
  return res
  // let res = []
  // routes.forEach(route => {
  //   const tmp = { ...route }
  //   if (hasPermission(roles, tmp)) {
  //     if (tmp.children) {
  //       tmp.children = filterAsyncRoutes(tmp.children, roles)
  //     }
  //     res.push(tmp)
  //   }
  // })
  // return res
}

const state = {
  routes: [],
  async:false,
  addRoutes: [],
  routeList: []
}

const mutations = {
  SET_ROUTES: (state, routes) => {
    state.addRoutes = routes
    state.routes =constantRoutes.concat(routes)
  },
  SET_ROUTE_LIST: (state, list) => {
    state.routeList = list
  }
}

const actions = {
  async generateRoutes({ commit,state }, roles = []) {
    return new Promise(resolve => {
      let accessedRoutes
      if (!state.async) {
        accessedRoutes = asyncRoutes
      } else {
        accessedRoutes = filterAsyncRoutes(roles)
      }
      console.log(accessedRoutes)
      commit('SET_ROUTES', accessedRoutes)
      router.addRoutes(accessedRoutes.concat([{ path: '*', redirect: '/error/404', hidden: true,name:'404' }]))
      resolve(accessedRoutes)
    })
  },
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
